<template>
	<view>
		<!-- 日期选择器 -->
		<view class="daterange">
			<uni-datetime-picker v-model="range" type="daterange" @change="change" />
		</view>
		<!-- 明细列表 -->
		<zy-table :headList="headList" :dataList="dataList" :loading="loading"></zy-table>
	</view>
</template>

<script>
	import {
		getYieldList
	} from "@/api/homepage.js"
	export default {
		data() {
			return {
				range: "", //日期选择器value值
				//明细表头
				headList: [{
						key: 'procedureCode',
						name: this.$t('public.procedureCode'),
					}, {
						key: 'procedureName',
						name: this.$t('public.procedureName'),
						width: '150'
					}, {
						key: 'styleNo',
						name: this.$t('public.styleNo'),
						width: '150'
					}, {
						key: 'styleName',
						name: this.$t('public.styleName'),
						width: '150'
					}, {
						key: 'num',
						name: this.$t('public.num'),
					}, {
						key: 'standardPrice',
						name: this.$t('public.gongjia'),
					}
					// {
					// 	key: 'standardPrice',
					// 	name: this.$t('homepage.OutputWage.standardPrice'),
					// },
					// {
					// 	key: 'total',
					// 	name: this.$t('homepage.OutputWage.wage'),
					// }
				],
				dataList: [], //明细表格数据
				loading: false, //表格数据加载
			}
		},
		methods: {
			//日期选择器事件
			change(e) {
				this.beginDate = e[0]
				this.endDate = e[1]
				if (e.length !== 0) {
					this.submitBtn()
				}
			},
			//查询事件
			submitBtn() {
				this.loading = true
				getYieldList({
					beginDate: this.beginDate,
					endDate: this.endDate
				}).then((res) => {
					this.loading = false
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
					this.dataList = []
					this.dataList = res.data
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
		}
	}
</script>
<style lang="scss" scoped>
	.daterange {
		background-color: #fff;
		width: calc(100% - 40rpx);
		padding: 20rpx;
	}
</style>